<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Adminique - admin template</title>
<meta charset="utf-8">

<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/skins/gray.css" title="gray">

<link rel="alternate stylesheet" type="text/css" href="css/skins/orange.css" title="orange">
<link rel="alternate stylesheet" type="text/css" href="css/skins/red.css" title="red">
<link rel="alternate stylesheet" type="text/css" href="css/skins/green.css" title="green">
<link rel="alternate stylesheet" type="text/css" href="css/skins/purple.css" title="purple">
<link rel="alternate stylesheet" type="text/css" href="css/skins/yellow.css" title="yellow">
<link rel="alternate stylesheet" type="text/css" href="css/skins/black.css" title="black">
<link rel="alternate stylesheet" type="text/css" href="css/skins/blue.css" title="blue">

<link rel="stylesheet" type="text/css" href="css/superfish.css">
<link rel="stylesheet" type="text/css" href="css/uniform.default.css">
<link rel="stylesheet" type="text/css" href="css/jquery.wysiwyg.css">
<link rel="stylesheet" type="text/css" href="css/facebox.css">
<link rel="stylesheet" type="text/css" href="css/smoothness/jquery-ui-1.8.8.custom.css">

<style type="text/css">
.wrap {
	position: relative; margin: 0 auto -80px auto; min-height: 100%; height: auto !important; height: 100%;
}
.footer {
	position: relative; clear: both; width: 100%; height: 80px; margin: 0 auto;
}
.bottom {
	height: 80px;
}

</style>

<!--[if lte IE 8]>
<script type="text/javascript" src="js/html5.js"></script>
<script type="text/javascript" src="js/selectivizr.js"></script>
<script type="text/javascript" src="js/excanvas.min.js"></script>
<![endif]-->

<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.8.custom.min.js"></script>
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
<script type="text/javascript" src="js/jquery.uniform.min.js"></script>
<script type="text/javascript" src="js/jquery.wysiwyg.js"></script>
<script type="text/javascript" src="js/superfish.js"></script>
<script type="text/javascript" src="js/cufon-yui.js"></script>
<script type="text/javascript" src="js/Delicious_500.font.js"></script>
<script type="text/javascript" src="js/jquery.flot.min.js"></script>
<script type="text/javascript" src="js/custom.js"></script>
<script type="text/javascript" src="js/facebox.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript" src="js/switcher.js"></script>

</head>
<body>

<div class="wrap">
	<header id="top">
		<div class="container_12 clearfix">
			<div id="logo" class="grid_5">
				<!-- replace with your website title or logo -->
				<a id="site-title" href="dashboard.html"><span>Admin</span>ique</a>
				<a id="view-site" href="#">View Site</a>
			</div>
			
			<div class="grid_4" id="colorstyle">
				<div>Change Color</div>
				<a href="#" rel="blue"></a>
				<a href="#" rel="green"></a>
				<a href="#" rel="red"></a>
				<a href="#" rel="purple"></a>
				<a href="#" rel="orange"></a>
				<a href="#" rel="yellow"></a>
				<a href="#" rel="black"></a>
				<a href="#" rel="gray"></a>
			</div>

			<div id="userinfo" class="grid_3">
				Welcome, <a href="#">Administrator</a>
			</div>
		</div>
	</header>

	<nav id="topmenu">
		<div class="container_12 clearfix">
			<div class="grid_12">
				<ul id="mainmenu" class="sf-menu">
					<li><a href="dashboard.html">Dashboard</a></li>
					<li><a href="styles.html">Styles</a></li>
					<li><a href="tables.html">Tables</a></li>
					<li><a href="forms.html">Forms</a></li>
					<li><a href="#">Sample Pages</a>
						<ul>
							<li><a href="news.html">News</a></li>
							<li><a href="gallery.html">Photo Gallery</a></li>
							<li><a href="settings.html">Settings</a></li>
							<li><a href="login.html">Login</a></li>
							<li><a href="1-column.html">1 Column Page</a></li>
							<li><a href="3-columns.html">3 Columns Page</a></li>
							<li class="current"><a href="sticky-footer.html">Sticky Footer</a></li>
						</ul>
					</li>
					<li><a href="#">Layout Width</a>
						<ul id="layoutwidth">
							<li><a href="#" rel="fixed">Fixed</a></li>
							<li><a href="#" rel="fluid">Fluid</a></li>
						</ul>
					</li>
					<li><a href="#">Dummy Menu</a>
						<ul>
							<li><a href="#">Menu</a></li>
							<li><a href="#">Menu</a>
								<ul>
									<li><a href="#">Menu</a></li>
									<li><a href="#">Menu</a></li>
									<li><a href="#">Menu</a>
										<ul>
											<li><a href="#">Menu</a></li>
											<li><a href="#">Menu</a></li>
											<li><a href="#">Menu</a></li>
										</ul>
									</li>
								</ul>
							</li>
							<li><a href="#">Menu</a></li>
						</ul>
					</li>
				</ul>
				<ul id="usermenu">
					<li><a href="#" class="inbox">Inbox (3)</a></li>
					<li><a href="#">Logout</a></li>
				</ul>
			</div>
		</div>
	</nav>

	<section id="content">
		<section class="container_12 clearfix">
			<section id="main" class="grid_9 push_3">
				<article>
					<div id="breadcrumbs">
						<a href="#">Home</a> &#187; 
						<a href="#">Sample</a> &#187; 
					</div>
					<h1>Sticky Footer</h1>
					<p>This page is an example of sticky footer. The footer sticks to the bottom of the browser window even when the content is short.</p>
				</article>
			</section>
			
			<aside id="sidebar" class="grid_3 pull_9">
				<div class="box info">
					<h2>Info</h2>
					<section>
						Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
					</section>
				</div>
			</aside>
		</section>
	</section>
	
	<div class="bottom"></div>
</div>

<div class="footer">
	<footer id="bottom">
		<section class="container_12 clearfix">
			<div class="grid_6">
				<a href="#">Menu 1</a>
				&middot; <a href="#">Menu 2</a>
				&middot; <a href="#">Menu 3</a>
				&middot; <a href="#">Menu 4</a>
			</div>
			<div class="grid_6 alignright">
				Copyright &copy; 2011 <a href="#">YourCompany.com</a>
			</div>
		</section>
	</footer>
</div>

</body>
</html>